/*!
 * Copyright 2019 WeBank
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 */
@import '@/common/style/variables.scss';
.workflow-wrap {
    width: 100%;
    height: 100%;
    background: $workspace-background;
    .workflowListContainer {
        display: flex;
        margin: 0 $padding-25;
        min-height: 685px;
        padding: $padding-25;
        border: $border-width-base  $border-style-base $border-color-base;
        background: $body-background;
        .workflowListLeft {
            flex: 1;
            .tabs-content {
                /deep/ .ivu-tabs-tab {
                    font-size: $font-size-large;
                }
            }
        }
    }
    .workflow-tabs {
        width: 100%;
        height: 32px;
        margin: 4px 0;
        white-space: nowrap;
        line-height: $line-height-base;
        font-size: $font-size-base;
        position: relative;
        color: $text-color;
        border-bottom: $border-width-base $border-style-base $border-color-base;
        padding: 0 5px;
        .workflow-tabs-item {
            margin: 0;
            height: 31px;
            padding: 5px 16px 4px;
            border-bottom: $border-width-base $border-style-base $border-color-base;
            border-radius: 4px 4px 0 0;
            background: #f8f8f9;
            display: inline-block;
            cursor: pointer;
            position: relative;
            &.active {
                height: 32px;
                padding-bottom: 5px;
                background: #fff;
                transform: translateZ(0);
                border: 1px solid #dcdee2;
                border-bottom:1px solid #fff;
                color: #2d8cf0;
            }
            .workflow-tabs-name {
                display: inline-block;
            }
            .workflow-tabs-close {
                width: 22px;
                margin-right: -6px;
                height: 22px;
                font-size: 22px;
                color: #999;
                text-align: right;
                vertical-align: middle;
                overflow: hidden;
                position: relative;
                top: -1px;
                transform-origin: 100% 50%;
                transition: all .3s ease-in-out;
                cursor: pointer;
            }
        }
    }
}
